<template>
  <zm-dialog title="自定义统计" :visible.sync="value" append-to-body :before-close="dialogClose" :close-on-click-modal="false">
    <app-block title="已选择数据">
      <el-checkbox-group v-model="checkedSelf" size="small">
        <el-checkbox class="mb10" :label="item.label" border v-for="(item,index) in selfList" :key="index">{{item.name}}</el-checkbox>
      </el-checkbox-group>
    </app-block>
    <app-block title="未选择数据">
      <el-checkbox-group v-model="checkedOther" size="small">
        <el-checkbox class="mb10" :label="item.label" border v-for="(item,index) in otherList" :key="index">{{item.name}}</el-checkbox>
      </el-checkbox-group>
    </app-block>
    <div slot="footer" class="tr">
      <el-button @click="dialogClose">取 消</el-button>
      <el-button type="primary" @click="submit">确 定</el-button>
    </div>
  </zm-dialog>
</template>

<script>
import dialogMixin from '@/mixins/dialogMixin'
// import integralOrder from '@/api/src/integralOrder'
export default {
  mixins: [dialogMixin],
  props: {
    apiGet: {
      // 获取列表信息API
      type: Function,
      default: () => { }
    },
    apiSubmit: {
      // 提交API
      type: Function,
      default: () => { }
    },
    params: { // 请求参数
      type: Object,
      default () {
        return {}
      }
    }
  },
  data () {
    return {
      selfList: [],
      otherList: [],
      checkedSelf: [],
      checkedOther: [],
      typeList: [
        {
          label: 'aa',
          value: 1
        },
        {
          label: 'bb',
          value: 2
        }
      ],
      pickerOptions: {
        disabledDate (time) {
          return time.getTime() < Date.now() - 8.64e7
        }
      }
    }
  },
  watch: {
    value (val) {
      if (val) {
        this.getFields()
      }
    }
  },
  created () {
  },
  methods: {
    async getFields () {
      const _res = await this.apiGet(this.params)
      this.selfList = _res.self
      this.checkedSelf = _res.self && _res.self.map(item => item.label)
      this.otherList = _res.other
      this.checkedOther = []
    },
    async submit () {
      const params = this.checkedSelf.concat(this.checkedOther)
      if (!params.length) return this.$message('至少选择一个', 'warning')
      if (params.length > 7) return this.$message(`最多选择7项,当前选择了${params.length}项`, 'warning')
      // await this.$apis.order.addCustomFields({ label: params.join(',') })
      await this.apiSubmit({ value: params.join(',') })
      this.$message({
        type: 'success',
        message: '操作成功!'
      })
      this.$emit('after-save')
      this.dialogClose()
    }
  }
}
</script>
